//初始化地图、图层
var map
var markerLayer
var polylineLayer
var circleLayer
var heat
var wfsLayer

// 地图初始化函数
function initMap() {
    // 定义地图中心点坐标
    var center = new TMap.LatLng(28.1630, 112.9325)
    // 定义map变量，调用 TMap.Map() 构造函数创建地图
    map = new TMap.Map(document.getElementById('map'), {
        center: center,// 设置地图中心点坐标
        zoom: 16.2,   // 设置地图缩放级别
        mapStyleId: 'style2',
    })

    wfsLayer = new TMap.vector.GeoJSONLayer({
        map: map,
        data: data,
        polygonStyle: new TMap.PolygonStyle({
            'color': '#3777FF', //面填充色
            'showBorder': true, //是否显示边线
            'borderColor': '#fff', //边线颜色
            'borderWidth': '1' //边线宽度
        }),
    });

    wfsLayer.setVisible(false)

    markerLayer = new TMap.MultiMarker({
        map: map,  //指定地图容器
        //样式定义
        styles: {
            "end": new TMap.MarkerStyle({
                "width": 25,  // 点标记样式宽度（像素）
                "height": 35, // 点标记样式高度（像素）
                "src": 'end.png',  //图片路径
                //焦点在图片中的像素位置，一般大头针类似形式的图片以针尖位置做为焦点，圆形点以圆心位置为焦点
                "anchor": {x: 16, y: 32}
            })
        }
    })

    polylineLayer = new TMap.MultiPolyline({
        id: 'polyline-layer',
        map: map,
        styles: {
            'style_blue': new TMap.PolylineStyle({
                'color': '#3777FF',
                'width': 6,
                'borderWidth': 5,
                'borderColor': '#FFF',
                'lineCap': 'round'
            })
        }
    })

    circleLayer = new TMap.MultiCircle({
        map,
        styles: {
            'circle': new TMap.CircleStyle({
                'color': 'rgba(41, 91, 255, 0.16)',
                'showBorder': true,
                'borderColor': 'rgba(41, 91, 255, 1)',
                'borderWidth': 2
            })
        }
    })

    let control = map.getControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM)
    control.setPosition(TMap.constants.CONTROL_POSITION.TOP_LEFT)
    control = map.getControl(TMap.constants.DEFAULT_CONTROL_ID.ROTATION)
    control.setPosition(TMap.constants.CONTROL_POSITION.TOP_LEFT)

    markerLayer.on('click', clickVolunteer)   // 点击地图显示志愿者信息框
    polylineLayer.on('click', clickPath)      // 点击路径显示完成请求框
}